<template>
	<view class="accountsecurity-page">
		<view style="height: 20upx;background-color: #F3F3F3;">
		</view>
		<view class="setting-module">
			<view class="setting-item">
				<text class="setting-item-title">手机号</text>
				<view class="setting-item-content"  @tap="skipTomcpnPage">
					<text class="text-font">{{diyMobile}}</text>
					<text class="iconfont icon-right"></text>
				</view>
			</view>
			<view class="setting-item" >
				<text class="setting-item-title">编辑资料</text>
				<view class="setting-item-content" @tap="skipToBasicPage">
					<text class="iconfont icon-right"></text>
				</view>
			</view>
			<view class="setting-item">
				<text class="setting-item-title">设置密码</text>
				<view class="setting-item-content" @tap="skipToModifyPage">
					<text class="text-font">修改密码</text>
					<text class="iconfont icon-right"></text>
				</view>
			</view>
			<view class="setting-item">
				<text class="setting-item-title">绑定微信</text>
				<view class="setting-item-content">
					<text class="text-font" @tap="bindWx">去绑定</text>
					<text class="iconfont icon-right"></text>
				</view>
			</view>
			<view class="setting-item">
				<text class="setting-item-title">绑定QQ</text>
				<view class="setting-item-content">
					<text class="text-font" @tap="bindQq">去绑定</text>
					<text class="iconfont icon-right"></text>
				</view>
			</view>
			<view class="setting-item">
				<text class="setting-item-title">绑定微博</text>
				<view class="setting-item-content">
					<text class="text-font" @tap="bindWb">去绑定</text>
					<text class="iconfont icon-right"></text>
				</view>
			</view>
			</view>
	</view>
</template>

<script>
    import api from '@/common/lib/request.js';
	export default {
		data() {
			return {
				isLogin: false
			}
		},
		onShow(){
			this.initInfo()
		},
		computed:{
			diyMobile(){
				if(this.mobile){
					return this.mobile.slice(0,3) + '****' + this.mobile.slice(6)
				}else{
					return ''
				}
			}
		},
		methods: {
			initInfo(){
				let userInfo = uni.getStorageSync('userInfo');
				if(userInfo){
					userInfo = JSON.parse(userInfo)
				    this.mobile = userInfo.mobile;
					this.isLogin = true;
				}else{
					this.isLogin = false;
				}
			},
			//修改手机号
			skipTomcpnPage(){
				let token = uni.getStorageSync('token');
				if(token){
					uni.navigateTo({
						url: '/pages/mine/accountsecurity/Mcpn'
					})
				}else{
					uni.showToast({
						title:"您尚未登录",
						icon: 'none'
					})
				}
			},
			//修改密码
			skipToModifyPage(){
				let token = uni.getStorageSync('token');
				if(token){
					uni.navigateTo({
						url: '/pages/mine/modify/modify'
					})
				}else{
					uni.showToast({
						title:"您尚未登录",
						icon: 'none'
					})
				}
			},
			//编辑资料
			skipToBasicPage(){
				if(!this.isLogin){
					uni.showToast({
						title:"您尚未登录",
						icon: 'none'
					})
					return
				}
				uni.navigateTo({
					url: '/pages/mine/basic/basic'
				})
			},
			bindWx() {
                if(!this.isLogin){
                    uni.showToast({
                        title:"您尚未登录",
                        icon: 'none'
                    })
                    return
                }
                let token = uni.getStorageSync('token');
                uni.login({
                    provider: 'weixin',
                    success: function (loginRes) {
                        uni.getUserInfo({
                            provider: 'weixin',
                            success: function (infoRes) {
                                api.request({
                                    url: '/bind-by-token',
                                    method: 'POST',
                                    data: {
                                        key: infoRes.userInfo.openId,
                                        token: token,
                                        type: 2
                                    }
                                }).then(response => {
                                    uni.showToast({
                                        title: '绑定成功',
                                        icon: 'none'
                                    });
                                }).catch(err => {
                                    console.log(err);
                                    uni.showToast({
                                        title: "绑定失败",
                                        icon: 'none'
                                    });
                                });
                            }
                        });
                    }
                });
			},
            bindQq() {
                if(!this.isLogin){
                    uni.showToast({
                        title:"您尚未登录",
                        icon: 'none'
                    })
                    return
                }
                let token = uni.getStorageSync('token');
                uni.login({
                    provider: 'qq',
                    success: function (loginRes) {
                        uni.getUserInfo({
                            provider: 'qq',
                            success: function (infoRes) {
                                api.request({
                                    url: '/bind-by-token',
                                    method: 'POST',
                                    data: {
                                        key: infoRes.userInfo.openId,
                                        token: token,
                                        type: 1
                                    }
                                }).then(response => {
                                    uni.showToast({
                                        title: '绑定成功',
                                        icon: 'none'
                                    });
                                }).catch(err => {
                                    console.log(err);
                                    uni.showToast({
                                        title: "绑定失败",
                                        icon: 'none'
                                    });
                                });
                            }
                        });
                    }
                });
            },
            bindWb() {
                if(!this.isLogin){
                    uni.showToast({
                        title:"您尚未登录",
                        icon: 'none'
                    })
                    return
                }
                let token = uni.getStorageSync('token');
                uni.login({
                    provider: 'sinaweibo',
                    success: function (loginRes) {
                        uni.getUserInfo({
                            provider: 'sinaweibo',
                            success: function (infoRes) {
                                api.request({
                                    url: '/bind-by-token',
                                    method: 'POST',
                                    data: {
                                        key: infoRes.userInfo.openId,
                                        token: token,
                                        type: 3
                                    }
                                }).then(response => {
                                    uni.showToast({
                                        title: '绑定成功',
                                        icon: 'none'
                                    });
                                }).catch(err => {
                                    console.log(err);
                                    uni.showToast({
                                        title: "绑定失败",
                                        icon: 'none'
                                    });
                                });
                            }
                        });
                    }
                });
            }
		}
	}
</script>

<style scoped>
  .setting-page{
  	height: 100%;
  	background-color: #F3F3F3;
  }
  .setting-module{
  	display: flex;
  	flex-direction: column;
  	padding: 0 30upx;
  	width: 690upx;
  	background-color: #FFFFFF;
	font-family: PingFangSC-Regular;
	font-size: 16px;
	color: #262626;
  }
  .text-font{
	  margin-right: 20upx;
	  font-family: PingFangSC-Regular;
	  font-size: 14px;
	  color: #999999;
  }
  .setting-item{
  	padding: 30upx 0 30upx 0;
  	border-bottom: 1upx solid #F5F5F5;
  	width: 100%;
  	display: flex;
  	justify-content: space-between;
  	align-items: center;
  }
  .setting-item-title{
  	font-size: 32upx;
  	color: #333333;
  }
  .setting-item-content{
  	color: #999999;
  	font-size: 30upx;
  }
  .custom-btn {
  	box-shadow: 0 0 5px 0 #F1F1F1;
  	width: 90%;
  	margin: 0 auto;
  	height: 100upx;
  	text-align: center;
  	line-height: 100upx;
  	background-color: #FFFFFF;
  	font-family: PingFangSC-Regular;
  	color: #262626;
  	font-weight: bold;
  	margin-top: 40upx;
  	font-size: 32upx;
  }
</style>
